import { Component, LogicRender } from 'refast';
import { withRouter } from 'react-router';
import './PageHome.less';
import { cloneElement } from 'react';
import * as logic from './logic';
import Animate from 'uxcore-animate';
import { RouteTransition } from 'react-router-transition';


class PageHome extends Component {

  constructor(props) {
    super(props, logic);

    this.onGcTitleClick = this.onGcTitleClick.bind(this);
    this.handleFgfcMapTabsChange = this.handleFgfcMapTabsChange.bind(this);
    this.handleLjdgCountClick = this.handleLjdgCountClick.bind(this);
  }

  shouldComponentUpdate(nextProps, nextState) {
    const thisProps = this.props || {},
      thisState = this.state || {};
    if (Object.keys(thisProps).length !== Object.keys(nextProps).length ||
      Object.keys(thisState).length !== Object.keys(nextState).length) {
      return true;
    }

    for (const key in nextProps) {
      if (thisProps[key] !== nextProps[key]) {
        return true;
      }
    }

    for (const key in nextState) {
      if (thisState[key] !== nextState[key]) {
        return true;
      }
    }
    return false;
  }

  onGcTitleClick(id) {
    this.props.onGcTitleClick(id);
  }

  handleFgfcMapTabsChange(tabKey) {
    this.props.onFgfcMapTabsChange(tabKey);
  }

  handleLjdgCountClick() {
    const { onLjdgCountClick } = this.props;
    if (onLjdgCountClick) {
      onLjdgCountClick()
    }
  }

  render() {

    return (
      <div className="page-home">
        <RouteTransition
          pathname={this.props.location.pathname}
          atEnter={{ opacity: -3 }}
          atLeave={{ opacity: -3 }}
          atActive={{ opacity: 1 }}>
          {cloneElement(this.props.children, {
            dispatchSumDialogVisible: this.props.dispatchSumDialogVisible,
            changeDispatchSumDialogVisible: this.props.changeDispatchSumDialogVisible,
            userconfig: this.props.userconfig,
            token: this.props.token,
            onGcTitleClick: this.onGcTitleClick,
            onFgfcMapTabsChange: this.handleFgfcMapTabsChange,
            onLjdgCountClick: this.handleLjdgCountClick,
            key: this.props.location.pathname,
            UIModel: this.props.UIModel
          })}
        </RouteTransition>
      </div>
    );
  }
}
export default withRouter(PageHome);
